<template>
  <div class="homeswiper">
    <!-- 轮播 -->
    <van-swipe :autoplay="2000">
      <van-swipe-item v-for="item in banner" :key="item.id">
        <img
          :src="`${$Imgurl}/api/public/showImg/${item.picture}`"
          class="image"
        />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
export default {
  name: "HomeSwiper",
  data() {
    return {
         banner: [],
    };
  },
  methods: {
    
  },
  mounted() {},
  created() {
      this.axios
      .get(`api/public/findHot/7/1`)
      .then((res) => {
        if (res.status === 200) {
          this.banner = res.data.data;
        }
      })
      .catch((error) => {
        console.log(error);
      });
  },
};
</script>

<style scoped>
/* 全局样式 */
* {
  margin: 0;
  padding: 0;
  list-style: none;
}

van-swipe {
  width: 100%;
  height: 3rem;
}

.image {
  width: 94%;
  margin: 0 3%;
  height: 3rem;
  border-radius: 0.3rem;
}
</style>
